<template>
  <div v-for="menu in menuData" :key="menu.path">
    <el-sub-menu v-if="menu.children" :index="menu.path">
      <template #title>
        <i :class="menu.icon"></i>
        <span>{{ menu.name }}</span>
      </template>
      <MenuTree :menuData="menu.children" />
    </el-sub-menu>
    <el-menu-item v-else :index="menu.path">
      <i :class="menu.icon"></i>
      <template #title>{{ menu.name }}</template>
    </el-menu-item>
  </div>
</template>

<script setup>
import { defineProps } from 'vue'
const props = defineProps({
    menuData: Array,
})
</script>